﻿<?php
    setlocale(LC_TIME, "es_ES");
    include('php/includes/definer.php');
    include('php/checkers/post.checker.php');
?>
<!DOCTYPE html>
<head>
    <title><?php echo($POST->titulo); ?></title>
    <meta name="description" content="En este post enterate de todo lo relacionado con <?php echo($POST->tagsToString(', ')); ?>">
    <meta property="og:title" content="<?php echo($POST->titulo) ?>"/>
    <meta property="og:url" content="<?php echo(URL.$POST->slug) ?>"/>
    <meta property="og:site_name" content="Lucía Celasco"/>
    <meta property="og:type" content="blog"/>
    <meta property="og:image" content="<?php echo(URL.'content/images/'.$POST->portada->src) ?>"/>
    <?php include('common/head.php') ?>
    <link rel="stylesheet" href="css/plugin/owl.carousel.2.0.0-beta.2.4/owl.carousel.css" />
</head>
<body>
<main>
    <?php include('common/header.php') ?>
    <div class="main-content category">
        <div class="wrapper">
            <?php include('php/printers/breadcrumb.printer.php'); ?>

            <aside class="main-aside">
                <div class="recent-posts">
                    <h4>Posts recientes</h4>
                    <div class="thumbs-grid">
                        <?php include(INC.'php/printers/postRecientes.printer.php'); ?>
                    </div>
                </div>
                
                <div class="adv-aside">
                    <div class="content"></div>
                </div>
            </aside>

            <div class="posts">
                <?php include(INC.'php/printers/post.printer.php'); ?>
                
                <?php if ($POST->categoria->slug != 'about-me'): ?>
                <header class="posts-related-header">
                    <h3><?php echo($POST->categoria->value); ?></h3>
                </header>
                <?php endif; ?>
                <div id="masonry">
                    <div class="posts-border"></div>
                    <div class="grid-sizer"></div>
                    <?php
                        $cuantos = 6;
                        $size = 'half';
                        $_GET['categoria'] = $POST->categoria->slug;
                        include('php/printers/postList.printer.php');
                    ?>
                </div>
            </div>
        </div>
        <?php if ($POST->categoria->slug != 'about-me'): ?>
        <nav class="posts-navigation">
            <div class="wrapper">
                <div class="posts-pagination">
                    <?php Paginador::printNumbers($cuantos, $total, $pagina); ?>
                </div>
                <?php include(INC.'php/printers/selectMes.printer.php'); ?>
            </div>
        </nav>
        <?php endif; ?>
    </div>
    <?php include('common/footer.php') ?>
</main>

<?php include('common/scripts.php') ?>
<script type="text/javascript" src="js/jquery.slides.min.js"></script>
<script type="text/javascript" src="js/masonry.min.js"></script>
<script type="text/javascript" src="js/plugin/jquery-timeago/jquery-timeago.min.js"></script>
<script type="text/javascript" src="js/plugin/jquery-timeago/jquery-timeago-es.min.js"></script>
<script type="text/javascript" src="js/plugin/owl.carousel.2.0.0-beta.2.4/owl.carousel.min.js"></script>
<script type="text/javascript" src="js/lurocks.min.js"></script>
<script>
    var CATEGORIA = <?php echo($jsCategoria); ?>;
    var POST = <?php echo($jsPost); ?>;
    //reload publiciadad
    function reloadPublicidad () {
        $('.adv-aside .content').html('');
        var banner;
        publicidad.getMediums(CATEGORIA, POST, function () {
            while (banner = publicidad.showMedium()) {
                if (!$('.adv-aside h4').length) $('.adv-aside').prepend('<h4>Publicidad</h4>');
                $('.adv-aside .content').append(banner);
            }
        });
        publicidad.getSmalls(CATEGORIA, POST, function () {
            for (var i=0; i<2; i++) {
                if (banner = publicidad.showSmall()) {
                    $('#publicidad'+(i+1)).append(banner);
                }
            }
        });
    }
    
    $('.select').removeClass('no-js');
    $(document).on('change', 'select', function() {
        var selected = $('option:selected', this).text();
        $(this).siblings('.current').text(selected);
        window.location = $(this).val().replace(/([a-z]+) ([0-9]{4})/, '$2/$1');
    });
    

    var $mason_img = $('#masonry').find('img');
    if ($mason_img.length != 0) {
        $mason_img.on('load', function() {
                lazy_masonry();
        });
    } else {
        lazy_masonry();
    }
    
    function lazy_masonry(){
        $('.posts').addClass('loaded');
        $('#masonry').masonry({
            itemSelector: '.post',
            columnWidth: '.grid-sizer'
        });
    }
    
    //timeago
    $('.timeago').timeago();
   
    //publicidad
    reloadPublicidad();
    //setInterval(reloadPublicidad, 1000*60*2);
    var $owl = $('.owl-carousel');
    $(window).load(function () {
        //slider
        function createCarousel (loop) {
            $owl.owlCarousel({
                items:1,
                loop:loop,
                margin:10,
                video:true,
                lazyLoad:false,
                center:true,
                nav:loop,
                navText: [
                    '<i class="fa fa-angle-left"></i>',
                    '<i class="fa fa-angle-right"></i>'
                ],
                pagination: false,
                autoHeight:true
            });
            $owl.on('resized.owl.carousel', function (event) {
                var $this = $(this);
                $this.find('.owl-height').css('height', $this.find('.owl-item.active').height());
            });
        }
        if ($('.post-img .item').length > 1 || $('.post-img .item-video') > 1) {
            createCarousel(true);
        } else {
            createCarousel(false);
            //$('.owl-carousel').show();
        }
        $('.post-img').addClass('loaded');
    });
    
</script>
</body>
</html>